import React from "react";
import { createStore } from "redux";

export const MyContext = React.createContext({ abc: 1 }); // TODO: 使用Provider和Consumer，初始化的值是没用的

export function MyProvider({ children }) {
  // TODO: 这里只有value可用，其他的属性是没用的
  return (
    <>
      <MyContext.Provider value={{ aaa: 111 }} xxx={{ ccc: 222 }}>
        <div>{children}</div>
        {/* TODO: Consumer下面只能这么写，就连一个简单的div标签包裹都不可以 */}
        <MyContext.Consumer>
          {(props) => {
            console.log("consumer props 2", props);
            return <div>from consumer 2</div>;
          }}
        </MyContext.Consumer>
      </MyContext.Provider>
    </>
  );
}
